<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
    <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
    <script src="${pageContext.request.contextPath}/layui/jquery-3.6.0.min.js"></script>
    <style>
        body{
            margin: 3px;
            padding: 5px;
        }
        th{
            background-color: #E9E7E7;
        }
        textarea{
            width: 100%;
            border:none;
        }
        #tourist>th{
            background-color: #ffffff;
        }
        td,#tourist>th{
            text-align:center;
        }
        input{
            border:none;
        }

    </style>
</head>
<body>
<!-- 内容区域 -->

<%--订单信息--%>
<table class="layui-table">
    <colgroup>
        <col width="300">
        <col width="300">
        <col>
    </colgroup>
    <tr ><th colspan="4">订单信息</th></tr>
    <tr>
        <td>订单编号</td>
        <td>
            <input type="text" class="form-control" placeholder="订单编号"
                   value="${order.orderNum}" readonly="readonly">
        </td>
        <td style="width: 200px;">下单时间</td>
        <td>
            <i class="layui-icon layui-icon-date"></i>
            <input type="text" class="form-control pull-right"
                   id="datepicker-a3" readonly="readonly"
                   value="${order.orderTimeStr}">
        </td>
    </tr>
    <tbody>
    <tr>
        <td>路线名称</td>
        <td>
            <input type="text" class="form-control" placeholder="路线名称"
                   value="${order.product.productName }" readonly="readonly">
        </td>
        <td>出发城市</td>
        <td>
            <input type="text" class="form-control" placeholder="出发城市"
                   value="${order.product.cityName }" readonly="readonly">
        </td>
    </tr>
    <tr>
        <td>出发时间</td>
        <td>
            <i class="layui-icon layui-icon-date"></i>
            <input type="text" class="form-control pull-right"
                   id="datepicker-a6" value=" <fmt:formatDate value="${order.product.departureTime}" pattern="yyyy-MM-dd HH:mm"/>"
                   readonly="readonly">
        </td>
        <td>出游人数</td>
        <td>
            <input type="text" class="form-control" placeholder="出游人数"
                   value="${order.peopleCount}" readonly="readonly">
        </td>
    </tr>
    <tr>
        <td>订单描述</td>
        <td colspan="3">
                <textarea class="form-control" rows="3" placeholder="订单描述" readonly="readonly">
                    ${order.orderDesc }
                </textarea>
        </td>
    </tr>
    </tbody>
    <!--订单信息/-->
    <!--游客信息-->
    <table class="layui-table">
        <colgroup>
            <col width="300">
            <col width="300">
            <col>
        </colgroup>
        <thead>
        <tr ><th colspan="6">游客信息</th></tr>
        <tr id="tourist">
            <th>人群</th>
            <th>姓名</th>
            <th>性别</th>
            <th>手机号码</th>
            <th>证件类型</th>
            <th>证件号码</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${order.travellers}" var="traveller">
            <tr>
                <td>${traveller.travellerTypeStr}</td>
                <td><input type="text" size="10" value="${traveller.name }"
                           readonly="readonly"></td>
                <td><input type="text" size="10" value="${traveller.sex }"
                           readonly="readonly"></td>
                <td><input type="text" size="20"
                           value="${traveller.phoneNum}" readonly="readonly"></td>
                <td><input type="text" size="15"
                           value="${traveller.credentialsTypeStr}" readonly="readonly"></td>
                <td><input type="text" size="28"
                           value="${traveller.credentialsNum }" readonly="readonly"></td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
    <%--        </div>--%>
    <!--游客信息/-->
    <!--联系人信息-->
    <table class="layui-table">
        <colgroup>
            <col width="300">
            <col width="300">
            <col>
        </colgroup>
        <tr ><th colspan="4">联系人信息</th></tr>
        <tr>
            <td>会员</td>
            <td>
                ${order.member.nickName }
            </td>
            <td>联系人</td>
            <td>
                ${order.member.name}
            </td>
        </tr>
        <tr>
            <td>手机号</td>
            <td>
                ${order.member.phoneNum}
            </td>
            <td>邮箱</td>
            <td>
                ${order.member.email}
            </td>
        </tr>
    </table>
    </div>
    <!--联系人信息/-->
    <!--费用信息-->
    <c:if test="${order.orderStatus==1}">
        <table class="layui-table">
            <colgroup>
                <col width="300">
                <col width="300">
                <col>
            </colgroup>
            <tr ><th colspan="4">费用信息</th></tr>
            <tr>
                <td>支付方式</td>
                <td>
                        ${order.payTypeStr}
                </td>
            </tr>
            <tr>
                <td>金额</td>
                <td>
                    ￥${order.product.productPrice}
                </td>
            </tr>
        </table>
    </c:if>
    <!--费用信息/-->
    <!--工具栏-->
    <div class="box-tools text-center" style="float: right">
        <button type="button" class="layui-btn" lay-filter="formDemo"
                onclick="history.back(-1);">返回</button>
    </div>
    <!--工具栏/-->
    <!-- 正文区域 /-->


    <%--</div>--%>
</table>
</body>
</html>
